<template>
  <el-form :model="formData" label-width="auto" ref="formRef" size="large">
    <el-form-item label="预案名称" prop="title">
      <el-input v-if="typeString!='info'" v-model="formData.title" placeholder="请输入"></el-input>
      <label v-else>{{formData.title}}</label>
    </el-form-item>

    <el-form-item label="制定单位" prop="createDepartment">
      <el-select v-if="typeString!='info'" v-model="formData.createDepartment" placeholder="请选择"> </el-select>
      <label v-else>{{formData.createDepartment}}</label>
    </el-form-item>

    <el-form-item label="预案类型" prop="type">
      <el-select v-if="typeString!='info'" v-model="formData.type" placeholder="请选择"> </el-select>
      <label v-else>{{formData.type  || '暂无'}}</label>
    </el-form-item>

    <el-form-item label="预案种类" prop="jsdw">
      <el-select v-if="typeString!='info'" v-model="formData.jsdw" placeholder="请选择"> </el-select>
       <label v-else>{{formData.type  || '暂无'}}</label>
    </el-form-item>

    <el-form-item label="预案内容" prop="xmlr">
      <el-input v-if="typeString!='info'"
        v-model="formData.xmlr"
        type="textarea"
        placeholder="请输入"
      ></el-input>
     <label v-else>{{formData.xmlr  || '暂无'}}</label> 
    </el-form-item>

    <el-form-item label="附件" prop="wcsj">
      <el-upload
        class="upload-demo"
        drag
        action=""
        multiple
        style="width:100%"
      >
        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
        <div class="el-upload__text">
            <p>上传文件</p>
         <div class="el-upload__tip">
           支持格式word、excel
          </div>
        </div>
      </el-upload>
    </el-form-item>

    <el-form-item>
      <el-col :span="24" style="text-align: center">
        <el-button size="large"  class="cancel" @click="confirm">取消</el-button>
        <el-button size="large" v-if="typeString!='info'" class="save" type="primary" @click="confirm">保存</el-button>
      </el-col>
    </el-form-item>
  </el-form>
</template>

<script setup lang="ts">
import Mitt from "@/utils/mitt";
import type { ComponentSize, FormInstance, FormRules } from "element-plus"
const props = defineProps({
    formData: {
        type: Object,
        default: ()=>{
         {}
        }
    },
    typeString:{
      type:String,
      default:''
    }
})
const formRef = ref<FormInstance>();

function resetForm() {
  formRef.value.resetFields();
}

function confirm() {
  console.log(props.formData)
  Mitt.emit("close-dialog");
}
</script>

<style lang="less" scoped>
/deep/
.el-upload-dragger{
  padding: inherit;
  border: 1px dashed #4FB9CF;
  background-color: inherit;
  padding: 21px 0;
}
/deep/
.el-upload__text{
    line-height: 26px;
    font-size: 20px;
    color: white;
}
/deep/
.el-upload__tip{
    font-size: 18px;
    color: #30525F;
    line-height: 20px;
    margin-top: 3px;
}
/deep/
.el-textarea__inner{
    color: #daf5fa !important;
    background: transparent !important;
        font-size: 20px;
    background: rgba(48, 82, 95, 0.62) !important;
    box-shadow: 0 0 0 1px #4FB9CF inset !important;
}
.cancel{
    color: #1BFBFA;
    background: rgba(27,251,250,0.19);
    border: 1px solid #1BFBFA;
}
.save{
    color: #091C25;
    background: #1BFBFA;
}
</style>
